import { connect } from 'dva';
import PropTypes from 'prop-types';
import React, { PureComponent } from 'react';

import { QuickQueryC } from '@/src/components';

import BaseInfoAsset from './BaseInfoAsset';
import BaseInfoProduct from './BaseInfoProduct';
import styles from './index.less';

import CardC from '../../Barra/comps/cardC';

@connect(({ qualificationManagementPlanMaintenanceM, loading, globalM }) => ({
  qualificationManagementPlanMaintenanceM,
  loading,
  globalM,
}))
class BasicsInfo extends PureComponent {
  static defaultProps = {
    onRef: () => {}, // 本组件的引用
    onChangePage: () => {}, // 新增编辑查看用于抛出显示框架还是弹窗参数
    onHandleTradingCode: () => {}, // 响应证券代码点击
    onFreshAssetsChange: () => {}, // 响应删除数据
  };

  constructor(props) {
    super(props);
    this.state = {
      radioVal: '1', // tab
      dataSourceProduct: [], // 产品-数据
      columnsProduct: [], // 产品-列
      numInPageProduct: 10, // 产品-pageSize
      currentPageProduct: 1, // 产品-currentPage
      totalProduct: 0, // 产品-total
    };
  }

  // 获取资产数据 父组件调用
  getAssetInfo = () => {
    this.BaseInfoAsset?.getAssetInfo();
  };

  componentDidMount() {
    this.props.onRef && this.props.onRef(this);
    const {
      globalM: { dataDictionary = {} },
    } = this.props;
    // 初始化redux数据
    this.props.dispatch({
      type: 'qualificationManagementPlanMaintenanceM/getDictionList',
      // [管理方式  ，  资产类别 资金实际投向,资产管理计划属性,购买结构,计息基础,利率类型]
      payload: {
        dictData: dataDictionary,
      },
    });
  }

  // 获取产品数据
  getProductInfo = () => {
    console.log('getProductInfo');
  };

  render() {
    const { radioVal } = this.state;
    const { onChangePage, onHandleTradingCode, onFreshAssetsChange } = this.props;
    return (
      <div className={styles.basicsInfo}>
        <div>
          <CardC title='基本信息' type='31' showContent={true} titleIsShow={false} />
          <div className={styles.baseInfoContent}>
            <div>
              <div className={styles.quickQuery}>
                <QuickQueryC
                  dataSource={[
                    { value: '1', title: '资产' },
                    { value: '2', title: '产品' },
                  ]}
                  disabled={['2']}
                  initialValue={radioVal}
                  onChange={(r) => this.setState({ radioVal: r })}
                />
              </div>
              {radioVal === '1' ? (
                <BaseInfoAsset
                  onFreshAssetsChange={onFreshAssetsChange}
                  onChangePage={onChangePage}
                  onHandleTradingCode={onHandleTradingCode}
                  onRef={(ref) => {
                    this.BaseInfoAsset = ref;
                  }}
                />
              ) : radioVal === '2' ? (
                <BaseInfoProduct
                  onChangePage={onChangePage}
                  onHandleTradingCode={onHandleTradingCode}
                  onRef={(ref) => {
                    this.BaseInfoProduct = ref;
                  }}
                />
              ) : null}
            </div>
          </div>
        </div>
      </div>
    );
  }
}
BasicsInfo.propTypes = {
  onRef: PropTypes.func, // 本组件的引用
  onChangePage: PropTypes.func, // 新增编辑查看用于抛出显示框架还是弹窗参数
  onHandleTradingCode: PropTypes.func, // 响应证券代码点击
  onFreshAssetsChange: PropTypes.func, // 响应删除数据
};
export default BasicsInfo;
